<template>
  <!-- 批量导入流程
   1：定义api
   2:导入
   3：读取excel成功后转换数据并调用api
   4:调用成功
       提示
       跳转到员工页面
 -->
  <div class="import">
    <UploadExcel :before-upload="beforeUpload" :on-success="onSuccess" />
  </div>
</template>
<script>
import { sysUserBatch } from '@/api/employees'
export default {
  created() {
    const result = [
      {
        姓名: '张三',
        年龄: 28
      },
      {
        姓名: '李四',
        年龄: 18
      }
    ]
    //   写出转换规则
    // const rules = {
    //   姓名: 'name',
    //   年龄: 'age'
    // }

    // const temp = result.map((item) => {
    //   const newObj = {}
    //   Object.keys(item).forEach((key) => {
    //     newObj[rules[key]] = item[key]
    //   })

    //   return newObj
    // })

    result.map((item) => {
      return {
        name: item['姓名'],
        age: item['年龄']
      }
    })
    // console.log(temp)
    //  const result = [
    //       {
    //         name: '张三',
    //         age: 28
    //       },
    //       {
    //         name: '李四',
    //         age: 18
    //       }
    //     ]
  },
  methods: {
    beforeUpload(file) {
      // console.log(file)
      const limitSize = file.size / 1024 < 100
      if (!limitSize) {
        this.$message.error('请上传小于100k的文件')
      }
      const limitType = /\.(xlsx|xls|csv)$/.test(file.name)
      if (!limitType) {
        this.$message.error('请上传小于1k的(xlsx|xls|csv)文件')
      }
      return limitSize && limitType
    },
    async onSuccess(obj) {
      const rules = {
        入职日期: 'timeOfEntry',
        姓名: 'username',
        工号: 'workNumber',
        手机号: 'mobile',
        转正日期: 'correctionTime'
      }
      console.log(obj.results)
      const newData = obj.results.map((key) => {
        const obj = {}
        // [入职日期,姓名....]
        Object.keys(rules).forEach((item) => {
          if (item === '入职日期' || item === '转正日期') {
            obj[rules[item]] = this.changeTime(key[item])
          } else {
            obj[rules[item]] = key[item]
          }
        })
        return obj
      })

      // const newData = obj.results.map((item) => {
      //   return {
      //     timeOfEntry: this.changeTime(item['入职日期']),
      //     username: item['姓名'],
      //     workNumber: item['工号'],
      //     mobile: item['手机号'],
      //     correctionTime: this.changeTime(item['转正日期'])
      //   }
      // })
      await sysUserBatch(newData)
      this.$message.success('导入员工成功')
      this.$router.push('/employees')
      console.log(obj)

      /*
      js时间：1970年1月1日开始计算，时间都是从0开始计算，从0点计算
      excel时间：1900年1月1日开始计算  给我们的值是到日前为止的天数，从1开始计算，从8点计算
      excel时间转换成js时间
    */
    },
    changeTime(excelTime) {
      const t = new Date(
        (excelTime - 1) * 24 * 60 * 60 * 1000 - 8 * 60 * 60 * 1000
      )
      t.setYear(t.getFullYear() - 70)
      return t
    }
  }
}
</script>
<style lang="scss" scoped>
.import {
  margin: 150px 0 0;
}
</style>
